<template>
  <view class="success-container">
    <!-- 导航栏 -->
    <uni-nav-bar left-icon="back" rightIcon="more-filled" title="多味生活" @clickLeft="clickBack"></uni-nav-bar>
    <view class="content">
      <image class="img" src="/static/success.png"></image>
      <view class="tips">订购成功！</view>
      <view class="intr">您已成功订购好玩游戏会员，资费10元/月。</view>
    </view>
    
    <view class="btn-box">
      <u-button :custom-style="customStyle" @click="back">确定</u-button>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        customStyle: {
          background: '#8FAFFF',
          color: '#fff'
        },
        pid: ''
      }
    },
    onLoad() {
      this.pid = uni.getStorageSync('dwsh-pid')
    },
    methods: {
      clickBack() {
        uni.navigateBack({
          delta: 1
        })
      },
      back() {
        uni.switchTab({
          url: '/'
        })
      }
    }
  }
</script>

<style lang="scss">
  .success-container {
    .content {
      padding: 80rpx;
      text-align: center;

      .img {
        width: 178rpx;
        height: 245rpx;
        margin-bottom: 40rpx;
      }

      .tips {
        font-size: 36rpx;
        color: #336CFA;
        margin-bottom: 30rpx;
      }

      .intr {
        font-size: 26rpx;
        color: #999;
        margin-bottom: 120rpx;
      }
    }
    
    
    /deep/.btn-box {
      // text-align: center;
    
      .u-btn {
        width: 686rpx;
        height: 76rpx;
        background: #8FAFFF;
        border-radius: 48rpx;
        border: none;
      }
    
      .u-primary-hover {
        background-color: #8FAFFF;
      }
    
      .u-hairline-border[data-v-6e15e680]:after {
        border: none;
      }
    
      .u-default-hover {
        background: #8FAFFF;
      }
    }
  }
</style>
